import React, { Component } from 'react'
import PubSub from 'pubsub-js'

export default class Paging extends Component {
    state = {
        users: [], //初始化数据,users初始值为空数组
        isFirst: true, //是否第一次打开页面
        isLoading: false, //是否加载中
        err: '', //保存错误信息
        current: 1, //当前页码
        pageSize: 30, //每页显示的条数
        goValue: 0,  //要取的条数index
        totalPage: 0,//总页数
    };

    componentDidMount() {
        this.token = PubSub.subscribe('myList', (_, stateObj) => {
            this.setState(stateObj)
        })
    }

    componentWillUnmount() {
        PubSub.unsubscribe(this.token);
    }

    render() {
        let userMessage;
        const { users, current } = this.state;
        if (users.items) {
            userMessage = (
                <nav aria-label="Page navigation">
                    <ul className="pagination">
                        <li>
                            <a href="/#" aria-label="Previous">
                                <span aria-hidden="true">&laquo;</span>
                            </a>
                        </li>
                        <li className="active"><a href="/#">{current}</a></li>
                        <li><a href="/#">2</a></li>
                        <li><a href="/#">3</a></li>
                        <li><a href="/#">4</a></li>
                        <li><a href="/#">5</a></li>
                        <li>
                            <a href="/#" aria-label="Next">
                                <span aria-hidden="true">&raquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            )
        }
        return (
            <div>
                {userMessage}
            </div>
        )
    }
}